<template>
    <div >
      <el-input
          v-model="searchName"
          placeholder="Please input"
          size="small"
          style="width: inherit;margin-right: 5px;margin-left: 5px;margin-top: 5px;"
      >
        <template #append>
          <el-button type="primary" @click="searchByName" >
            <el-icon>
              <Search color="#409EFC" >
              </Search>
            </el-icon>

          </el-button>
        </template>
      </el-input>
      <el-scrollbar height="700px">
          <TaskCard v-for="task in this.store.state.flightTasks" :key="task" :init-flight-task="task"></TaskCard>
      </el-scrollbar>
    </div>

  <el-pagination
      :small=true
      background
      pager-count=4
      layout="prev, pager, next"
      v-model:page-count="pageCnt"
      v-model:current-page="crrntPage"
      @current-change="handleCurrentChange"
      style="text-align: center"
  />
  <div>
    <el-button round type="primary"
               style="margin:10px;width: 90%;display: inline-block;
               margin-top: 50px" @click="createNewFlightTask">新建航点任务</el-button>
  </div>
</template>

<script>
// import store from '../store'
import TaskCard from "@/components/TaskCard";
import request from "@/utils/request";
import { Search } from '@element-plus/icons-vue';
export default {
  components: {Search,TaskCard},
  data() {
    return {
      store:this.$store,
      pageCnt:8,
      crrntPage:1,
      searchName:""
    }
  },
  mounted() {
    this.getFlightTasks();
  },
  methods:{
    searchByName:function (){
      if(this.searchName===""){
        this.getFlightTasks();
      }else{
        request.get("/flight_task/listByNameWithPage/"+this.searchName+"/"+1).
        then(res=>{
          if(res){
            //console.log(res.data);
            this.store.commit('updateFlightTasks',res.data.flightTaskList);
            this.pageCnt = res.data.pageCnt;
          }else {
            console.log("请求飞行任务资源失败")
          }
        })
      }
    },
    handleCurrentChange:function (page){

      if(this.searchName===""){
        request.get("/flight_task/listByPage/"+page).
        then(res=>{
          if(res){
            //console.log(res.data);
            this.store.commit('updateFlightTasks',res.data.flightTaskList);
            this.pageCnt = res.data.pageCnt;
          }else {
            console.log("请求飞行任务资源失败")
          }
        })
      }else{
        request.get("/flight_task/listByNameWithPage/"+this.searchName+"/"+page).
        then(res=>{
          if(res){
            //console.log(res.data);
            this.store.commit('updateFlightTasks',res.data.flightTaskList);
            this.pageCnt = res.data.pageCnt;
          }else {
            console.log("请求飞行任务资源失败")
          }
        })
      }

    },
    getFlightTasks(){
      if(this.searchName===""){
        //获取所有无人机任务
        request.get("/flight_task/listByPage/1").
        then(res=>{
          if(res){
            //console.log(res.data);
            this.store.commit('updateFlightTasks',res.data.flightTaskList);
            this.pageCnt = res.data.pageCnt;
          }else {
            console.log("请求飞行任务资源失败")
          }
        })
      }else{
        request.get("/flight_task/listByNameWithPage/"+this.searchName+"/"+1).
        then(res=>{
          if(res){
            //console.log(res.data);
            this.store.commit('updateFlightTasks',res.data.flightTaskList);
            this.pageCnt = res.data.pageCnt;
          }else {
            console.log("请求飞行任务资源失败")
          }
        })
      }

    },
    createNewFlightTask:function() {
      let user = JSON.parse(sessionStorage.getItem("user"));
      if(user.permission===2){
        alert("您没有权限！");
        return;
      }
      // this.store.commit('addLogInfo','新增航线任务1')
      // this.store.commit('addLogInfo','新增航线任务2')
      this.store.commit('setIsUpdateRL',false);
      this.store.commit('rightAsideOnAndOff',true);
      this.store.commit('taskListViewOnAndOff',false);
      this.store.commit('updateTaskButtonOnAndOff',false);
      this.store.commit('createTaskButtonOnAndOff',true);
      this.store.commit('mouseToolDraw',this.store.state.AMap);
      //新建航点任务前，保证当前操作的航点任务为空
      this.store.commit('clearCurrentFlightTask');
    }
  }
}
</script>
<style scoped>

</style>